<template>
	<view>
		<u-tabbar :value="currentTabbar" @change="tabbarClick" :fixed="true" :placeholder="true"
			:safeAreaInsetBottom="true" zIndex="1">


			<u-tabbar-item  v-for="(itme,index) in tabbarList" :text="itme.text" :key="index">
				<image :class="itme.text == ''?'publish_img':'bar_img'" slot='inactive-icon' :src="itme.iconPath"></image>
				<image :class="itme.text == ''?'publish_img':'bar_img'" slot='active-icon' :src="itme.selectedIconPath"></image>
			</u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		props: {
			currentTabbar: {
				type: Number,
				default () {
					return 0
				}
			}
		},
		name: "tabbar",
		data() {
			return {
				tabbarList: [{
						"pagePath": "/pages/index/index",
						"iconPath": "/static/tabber/home.png",
						"selectedIconPath": "/static/tabber/selecthome.png",
						"text": "首页"
					},
					{
						"pagePath": "/pages/topic/topic",
						"iconPath": "/static/tabber/circle.png",
						"selectedIconPath": "/static/tabber/selectcircle.png",
						"text": "话题"
					},
					{
						"pagePath": "/pages/article/push",
						"iconPath": "/static/tabber/publish.png",
						"selectedIconPath": "/static/tabber/publish.png",
						"text": ""
					},
					{
						"pagePath": "/pages/message/message",
						"iconPath": "/static/tabber/message.png",
						"selectedIconPath": "/static/tabber/selectmessage.png",
						"text": "消息"
					}, {
						"pagePath": "/pages/center/userCenter",
						"iconPath": "/static/tabber/my.png",
						"selectedIconPath": "/static/tabber/selectmy.png",
						"text": "我的"
					}
				],
			};
		},
		methods: {
			// 底部导航栏切换
			tabbarClick(e) {
				if (e == this.currentTabbar) {
					return
				} else if (this.tabbarList[e].text == ''){
					if(!this.$authUtil.isLoginedin(true)){
						return
					}
					uni.navigateTo({
						url: this.tabbarList[e].pagePath
					})
				}else {
					uni.switchTab({
						url: this.tabbarList[e].pagePath
					})

				}


			},
		}
	}
</script>

<style lang="scss">
	.bar_img {
		width: 22px;
		height: 22px;
	}
	.publish_img{
		width: 48px;
		height: 48px;
	}
</style>
